<template>
  <div>
    <slideshowVue :imglist="imglist"></slideshowVue>
    <div class="list">

      <listVue v-for="(item, index) in goodslist" :key="index" :item="item"></listVue>
    </div>
  </div>
</template>

<script>
import slideshowVue from '../components/slideshow.vue';
import listVue from '@/components/list.vue';
import axios from 'axios'
import { Ref, toRefs, reactive } from 'vue';
export default {
  components: {
    slideshowVue,
    listVue
  },
  setup() {
    const data = reactive({
      imglist: [],
      goodslist: []
    })
    axios.get('https://api.it120.cc/xiaochengxu/banner/list').then(res => {
      data.imglist = res.data.data
    })
    axios.get('https://api.it120.cc/xiaochengxu/shop/goods/list').then(res => {
      data.goodslist = res.data.data
      console.log(res);
    })
    return { ...toRefs(data) }
  }
}
</script>

<style lang="scss" scoped>
.list {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
</style>